<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta content="text/html" charset="UTF-8"/>
    <style type="text/css">
        * { margin: 0; padding: 0;}
        html, body {height: 100%; width: 100%}
        canvas { display: block;}
    </style>
</head>
<body>
<canvas id="canvas">
    Your browser not support Canvas!
</canvas>

<script type="text/javascript">
    var c = document.getElementById('canvas');
    var ctx = c.getContext('2d');

    function reSizeCanvas(){
        //c.setAttribute('width',window.innerWidth);
        //c.setAttribute('height',window.innerHeight);
        c.width = window.innerWidth;
        c.height = window.innerHeight;
        ctx.fillRect(0,0,c.width,c.height);
    }
    reSizeCanvas();
    window.addEventListener('resize',reSizeCanvas,false);

</script>
</body>
</html>